:root {
  --default-header-margin: 0;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  margin-top: var(--default-header-margin);
  margin-bottom: var(--default-header-margin);
}

.h1 { font-size: 2em; }
.h2 { font-size: 1.5em; }
.h3 { font-size: 1.17em; }
.h4 { font-size: 1.12em; }
.h5 { font-size: .83em; }
.h6 { font-size: .75em; }

@media screen and (--breakpoint-min-sm) {
  .sm-h1 { font-size: 2em; }
  .sm-h2 { font-size: 1.5em; }
  .sm-h3 { font-size: 1.17em; }
  .sm-h4 { font-size: 1.12em; }
  .sm-h5 { font-size: .83em; }
  .sm-h6 { font-size: .75em; }
}

@media screen and (--breakpoint-min-md) {
  .md-h1 { font-size: 2em; }
  .md-h2 { font-size: 1.5em; }
  .md-h3 { font-size: 1.17em; }
  .md-h4 { font-size: 1.12em; }
  .md-h5 { font-size: .83em; }
  .md-h6 { font-size: .75em; }
}

@media screen and (--breakpoint-min-lg) {
  .lg-h1 { font-size: 2em; }
  .lg-h2 { font-size: 1.5em; }
  .lg-h3 { font-size: 1.17em; }
  .lg-h4 { font-size: 1.12em; }
  .lg-h5 { font-size: .83em; }
  .lg-h6 { font-size: .75em; }
}
